
var left = document.getElementsByClassName('carousel2-left')[0];
var right = document.getElementsByClassName('carousel2-right')[0];

var leftFlag = true, rightFlag = true;

left.onclick = function () {
    if (leftFlag) {
        leftFlag = false;
        var ul_pre = document.getElementsByClassName('pre-ul')[0];
        var ul_cur = document.getElementsByClassName('cur-ul')[0];
        var ul_next = document.getElementsByClassName('next-ul')[0];
        leftForward(ul_cur, -645);
        leftForward(ul_next, 0);

        ul_pre.style.left = '645px';

        ul_next.className = 'cur-ul';
        ul_cur.className = 'pre-ul';
        ul_pre.className = 'next-ul';
    }
}

right.onclick = function () {
    if (rightFlag) {
        rightFlag = false;
        var ul_pre = document.getElementsByClassName('pre-ul')[0];
        var ul_cur = document.getElementsByClassName('cur-ul')[0];
        var ul_next = document.getElementsByClassName('next-ul')[0];
        rightForward(ul_cur, 645);
        rightForward(ul_pre, 0);

        ul_next.style.left = '-645px';

        ul_next.className = 'pre-ul';
        ul_cur.className = 'next-ul';
        ul_pre.className = 'cur-ul';
    }
}



function leftForward(obj, stopPoint) {
    var leftTimer = setInterval(function () {
        if (obj.offsetLeft == stopPoint) {
            clearInterval(leftTimer);
            leftFlag = true;
        }
        obj.style.left = obj.offsetLeft - 3 + 'px';
    }, 1);
}


function rightForward(obj, stopPoint) {
    var rightTimer = setInterval(function () {
        if (obj.offsetLeft == stopPoint) {
            clearInterval(rightTimer);
            rightFlag = true;
        }
        obj.style.left = obj.offsetLeft + 3 + 'px';
    }, 1);
}